<template>
  <footer>
  	<div class="footer-top">
  		<div>
	  		<ul class="foot-list">
	  			<li>
	  				<img class="foot-logo" src="@/assets/images/logo.png">
	  			</li>
	  			<li>
	  				<dl>
	  					<dt>智慧零售事业部</dt>
	  					<dd>招商加盟</dd>
	  					<dd>诚邀合伙人</dd>
	  				</dl>
	  			</li>
	  			<li>
	  				<dl>
	  					<dt>科技事业部</dt>
	  					<dd>自主研发</dd>
	  					<dd>产品介绍</dd>
	  				</dl>
	  			</li>
	  			<li>
	  				<dl>
	  					<dt>金融服务事业部</dt>
	  					<dd>团队介绍</dd>
	  					<dd>产品与服务</dd>
	  				</dl>
	  			</li>
	  		</ul>
  		</div>
  	</div>
  	<div class="foot-info">
  		<div class="foot-el">
	  		<div class="fi-left">
	  			<span>法律声明</span>
	  			<span>网站地图</span>
	  			<span>联系我们</span>
				</div>
				<div class="fi-right">
	  			<span>@2018 六沐集团版权所有 粤ICP备17001985号</span>
				</div>
			</div>
		</div>
  </footer>
</template>

<script>
export default {
  name: 'Footer',
  data :function() {
    return {
      msg: 'Welcome to Your Vue.js App'
    }
  },
  components:{
  }
}
</script>
<style scoped lang="less">
	footer{
		background: #dedede;
		.footer-top{
			width: 1200px;
			margin: 0 auto;
			.foot-list{
				display: table;
				width: 100%;
				li{
					margin: 40px 0px;
					width: 24%;
					float: left;
					text-align: center;
					border-left: 2px solid #d4d4d4;
					font-size: 14px;
					.foot-logo{
						width: 240px;
						height: 77px;
					}
					&:first-child{
						border: none;
					}
					dt{
						font-weight: bold;
					}
					dd{
						padding-top: 20px;
						color: #a2a2a2;
						cursor: pointer;
					}
				}
			}
		}
		.foot-info{
			background: #c62e25;
			padding:20px 0px;
			.foot-el{
				width: 1200px;
				margin: 0 auto;
				display:table;
				color: #fff;
				.fi-left{
					float: left;
					span{
						padding-right: 40px;
					}
				}
				.fi-right{
					float: right;
				}
			}
		}
	}
</style>
